import { useCallback } from "react";
import { View, Text, Button, Image } from "@tarojs/components";
import { useEnv, useNavigationBar, useModal, useToast } from "taro-hooks";
import Taro, {
  navigateTo,
  navigateBack,
  switchTab,
  useLoad,
  useDidShow,
  useDidHide,
  usePullDownRefresh,
  useReachBottom,
  useRouter,
  useShareAppMessage,
} from "@tarojs/taro";
/**
 *
 * @name useToast
 * @name useModal
 *
 */

const HomePage = () => {
  const [showToast] = useToast({ mask: true });
  const [_, { setTitle }] = useNavigationBar({ title: "Taro Hooks" });
  const data = useEnv();
  console.log("环境变量", data);

  // { path: '', params: { ... } }
  const router = useRouter();

  useLoad(() => {
    console.log("useLoad");
  });

  usePullDownRefresh(() => {
    console.log("usePullDownRefresh: 下拉刷新");
    setTimeout(() => {
      // Taro === wx
      Taro.stopPullDownRefresh();
    }, 3000);
  });
  // 修改分享数据
  useShareAppMessage(() => {
    return {
      title: "你好，我是分享标题",
      imageUrl:
        "https://devinwang0712.oss-cn-beijing.aliyuncs.com/1671169916965_1.jpeg",
    };
  });
  // // 弹出框
  const [show] = useModal({
    title: "Taro Hooks!",
    showCancel: true,
    confirmColor: "#8c2de9",
    confirmText: "支持一下",
    mask: true,
  });
  // // 处理弹出框内容
  // const handleModal = useCallback(() => {
  //   show({ content: "不如给一个star⭐️!" }).then(() => {
  //     showToast({ title: "点击了支持!" });
  //   });
  // }, [show, showToast]);

  const handleModal = async () => {
    try {
      const response = await show();
      if (response.confirm) {
        showToast({ title: "点击了确定" });
        // router.path = "/pages/index/index";
        console.log("router", router);
        navigateTo({
          url: "/pages/detail/index?id=1",
        });
      } else {
        showToast({ title: "点击了取消", icon: "error" });
      }
    } catch (error) {
      showToast({ title: error });
    }
  };

  console.log("-------------handleModal:---------------");

  return (
    <View>
      <Button onClick={handleModal}>Home</Button>
      {/* <Button onClick={handleModal}>按钮-home</Button> */}
    </View>
  );
};

export default HomePage;
